<template>
  <div class="Ming">
    <!-- 顶部数据展示组件 -->
    <div class="Top">
      <!-- <TopData /> -->


    </div>
    <div class="box">
      <div class="Left">
        <!-- 左上 -->
        <div>
          <!-- <LeftTop></LeftTop> -->
        </div>
        <!-- 左下 -->
        <div>
          <!-- <LeftBottom></LeftBottom> -->
        </div>
      </div>

      <div class="middle">
        <!-- 中间内容 -->
      </div>

      <div class="Left">
        <!-- 右上 -->
        <div>
          <!-- <RightTop></RightTop> -->
        </div>
        <!-- 右下 -->
        <div>
          <!-- <RightBottom></RightBottom> -->
        </div>
      </div>
    </div>
  </div>
</template>

<script>
// 导入
// import TopData from '@/components/TopData.vue';
// import LeftTop from '@/components/LeftTop.vue';
// import RightTop from '@/components/RightTop.vue';
// import LeftBottom from '@/components/LeftBottom.vue';
// import RightBottom from '@/components/RightBottom.vue';

export default {
  // name:'mhssjk',
  // 注册
  components: {
    // TopData,
    // LeftTop,
    // RightTop,
    // LeftBottom,
    // RightBottom
  }
}
</script>

<style>
.Ming {
  width: 100%;
  height: 100vh;
  background-image: url(../assets/back-one.jpg);
  /* background-size: cover; */
  /* 背景图铺满屏幕 */
  background-size: 100% 100%;
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
}

.Top {
  width: 100%;
  height: 15%;
  text-align: center;
  color: white;
}

.box {
  width: 100%;
  height: 85%;
  display: flex;
  flex-direction: row;
}

.Left {
  width: 23%;
  height: 600px;
}

.middle {
  width: 60%;
}
</style>